import React from 'react';
import { withRouter } from 'react-router-dom';
import { FooterEn } from 'components';
import './index.less';
import logoImg from './images/img_logo.png';
import tu1 from './images/img_tu1.png';
import tu2 from './images/img_tu2.png';
import tu3 from './images/img_tu3.png';
import tu4 from './images/img_tu4.png';
import tu5 from './images/img_tu5.png';

const PageSite = (props) => {
  return (
    <div className="teacher-reg-page">
      <div className="tea-reg-hd">
        <div className="tea-reg-con">
          <div className="hd-msg">
            <div className="msg-logo">
              <img
                src={logoImg}
                alt=""
                onClick={() => props.history.push('/home')}
              />
            </div>
            <h3 className="msg-tit">Hi there!</h3>
            <div className="msg-txt">
              <p>Want to earn <b>$18-$22/hr</b>?</p>
              <p>Enjoy working at home Or anywhere?</p>
              <p>Join us! It's easy!</p>
            </div>
          </div>
          <div className="sit-form">
            {props.children}
          </div>
        </div>
      </div>
      <div className="section-1">
        <div className="tea-reg-con">
          <div className="part">
            <img src={tu1} alt=""/>
            <h3>Who are we?</h3>
            <p>
              Zilongshu is a website that
              provides Chinese students online
              English classes. We are located in China.
              Chinese parents invest a lot for their
              kids to learn English. But still they can't
              learn it effectively.
              But now, you can help them, through the Internet!
            </p>
          </div>
          <div className="part">
            <img src={tu2} alt=""/>
            <h3>What do we need?</h3>
            <p>
              Zilongshu needs good English teathers
              for our online English classes.
              If you are a native speaker, and you've
              been a teather. That's excellent!
              If you have a TESOL or a TFL, that's perfect!
              But if you don't have those certifications,
              we still want to hear from you.
              We can give you a training to make you qualified
              to be a basic English teather for Chinese students.
              Actually, being a good teather needs more
              patience and passion than a certification.
            </p>
          </div>
          <div className="part">
            <img src={tu3} alt=""/>
            <h3>How does it work?</h3>
            <p>
              you may register on our website.
              Then sign a simple contract to ensure you
              are paid in time. Our classes are
              mostly on 7-9pm Beijing time, with two
              kids, 30-minutes.
            </p>
          </div>
        </div>
      </div>
      <div className="section-2">
        <div className="tea-reg-con">
          <h3 className="part-tit">
            As an English teacher, you will
          </h3>
          <div className="part">
            <img src={tu4} alt=""/>
            <p>
              <b>Teach---</b>
              Teach Zilongshu students the English language,
              help them understand English and use it. You
              may use our materials. You may add something on
              the materials, such as pictures and words.
              Innovative teaching is encouraged.
            </p>
          </div>
          <div className="part">
            <p>
              <b>Remark---</b>
              Give your remarks about the class and the
              students after your class.
            </p>
            <img src={tu5} alt=""/>
          </div>
        </div>
      </div>
      <FooterEn />
    </div>
  )
}

export default withRouter(PageSite);
